import { Breadcrumb } from 'antd';
import React, { FC } from 'react';
import { FormPanel, Utils, FormPanelStatus } from 'lfun-bg-comp';
import _ from 'lodash';
import { PageContainer } from '@/component/page-container';
import { createSysConfig, getSysConfig, updateSysConfig } from '@/service/teacher/sysconfig';
import { isPermission } from '@/component/permission-button';

const Groups: FC = () => {
  const [vals, setVals] = React.useState<any>({});
  const list = [
    {
      title: '学校属地',
      labelCol: { span: 2 },
      wrapperCol: { span: 22 },
      inputs: [
        {
          label: '学校属地',
          name: 'school_area_type',
          key: 'school_area_type',
          inputType: 'radio',
          span: 24,
          disabled: !isPermission({
            permission: 'edit',
          }),
          renderOption: [
            {
              label: '行政属地',
              value: 'borough',
            },
            {
              label: '行政属地',
              value: 'block',
            },
          ],
        },
      ],
    },
    {
      title: '新教职工招聘截止日期',
      disabled: true,
      inputs: [
        {
          label: '新教职工招聘截止日期',
          name: 'recruit_deadline',
          key: 'recruit_deadline',
          inputType: 'date',
          span: 24,
          disabled: !isPermission({
            permission: 'edit',
          }),
        },
      ],
    },
    {
      title: '新教职工入职',
      inputs: [
        {
          label: '新教师入职',
          name: 'recruit_type',
          key: 'recruit_type',
          inputType: 'radio',
          span: 24,
          disabled: !isPermission({
            permission: 'edit',
          }),
          renderOption: [
            {
              label: '手动',
              value: 'manual',
            },
            {
              label: '入职时间',
              value: 'date_of_employment',
            },
            {
              label: '入职截至时间',
              value: 'deadline_for_onboarding',
            },
          ],
        },
      ],
    },
  ];
  const init = async () => {
    const res = await getSysConfig(Utils.getProps('schoolInfo')?.school_id);
    const vals = {};
    if (res.success) {
      res.data.items.forEach(item => {
        vals[item.config_name] = item.config_value;
        vals[`${item.config_name}_id`] = item.id;
      });
      setVals(vals);
    }
  };
  React.useEffect(() => {
    init();
  }, []);

  return (
    <PageContainer header={<Breadcrumb items={[{ title: '系统配置' }]} />}>
      <FormPanel
        values={vals}
        template={list}
        buttonsDisplay="none"
        onValuesChange={async (sv: any) => {
          console.log(sv, '===========>>>>');
          let curKey;
          let isUpdate = false;
          Object.keys(sv).forEach(key => {
            curKey = key;
            isUpdate = vals[key];
          });
          let res;
          if (isUpdate) {
            res = await updateSysConfig({
              config_name: curKey,
              config_value: sv[curKey],
              school_id: Utils.getProps('schoolInfo')?.school_id,
              id: vals[`${curKey}_id`],
            });
          } else {
            res = await createSysConfig({
              config_name: curKey,
              config_value: sv[curKey],
              school_id: Utils.getProps('schoolInfo')?.school_id,
            });
          }
          if (res.success) {
            init();
          }
        }}
      />
    </PageContainer>
  );
};

export default Groups;
